﻿<phone:PhoneApplicationPage
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
	xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
	xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800" 
	x:Class="MSHelpMe.MainPage"
	d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"
	FontFamily="{StaticResource PhoneFontFamilyNormal}"
	FontSize="{StaticResource PhoneFontSizeNormal}"
	Foreground="{StaticResource PhoneForegroundBrush}"
	SupportedOrientations="Portrait" Orientation="Portrait"
	shell:SystemTray.IsVisible="False" BackKeyPress="PhoneApplicationPage_BackKeyPress" Loaded="MainPage_Loaded">
    <phone:PhoneApplicationPage.Resources>
    </phone:PhoneApplicationPage.Resources>

    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator IsIndeterminate= "False" IsVisible="False" />
    </shell:SystemTray.ProgressIndicator>
    
    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent" Height="768" VerticalAlignment="Bottom">
        <!--<StackPanel x:Name="loading" Orientation="Horizontal" Height="28" VerticalAlignment="Top" Margin="180,16,0,0" Visibility="Collapsed" >
            <TextBlock Text="Loading" Style="{StaticResource PhoneTextAccentStyle}"/>
            <ProgressBar Width="200" IsIndeterminate="True" Padding="0" />
        </StackPanel>-->
        <!--Pivot Control-->
        <controls:Pivot Name="pivot" Title="MS, Help Me!" SelectionChanged="pivot_SelectionChanged">
            <controls:PivotItem Header="Search">
                <StackPanel>
                    <Grid>
                        <TextBox x:Name="txtSearchText" Text="Enter your question here..." BorderThickness="1" TextWrapping="Wrap" Height="180" FontFamily="Segoe WP Light" KeyUp="txtSearchText_KeyUp" TextChanged="txtSearchText_TextChanged" GotFocus="txtSearchText_GotFocus" />
                        <Button x:Name="btnClear" Width="64" Height="64" VerticalAlignment="Bottom" HorizontalAlignment="Right" BorderThickness="0" Click="btnClear_Click" Margin="0,0,12,12">
                            <Button.Background>
                                <ImageBrush Stretch="None" ImageSource="/Images/close.png"/>
                            </Button.Background>
                        </Button>
                    </Grid>
                    <Button x:Name="btnSearch" Click="btnSearch_Click" BorderBrush="{x:Null}" FontSize="48" Height="128"  >
                        <Button.Background>
                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                        </Button.Background>
                        <Button.Content>
                            <StackPanel Orientation="Horizontal" Width="442">
                                <Image Source="/Images/search.png" />
                                <TextBlock Text="Search" Style="{StaticResource PhoneTextTitle1Style}" Margin="8,0,0,0"/>
                            </StackPanel>
                        </Button.Content>
                    </Button>
                    <Button x:Name="btnTakePicture" FontSize="48" BorderBrush="{x:Null}" Height="128" Click="btnTakePicture_Click">
                        <Button.Background>
                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                        </Button.Background>
                        <Button.Content>


                            <StackPanel Orientation="Horizontal" Width="442">
                                <Image Source="/Images/photo.png"></Image>
                                <TextBlock Text="Photo" Style="{StaticResource PhoneTextTitle1Style}" Margin="8,0,0,0"/>
                            </StackPanel>
                        </Button.Content>
                    </Button>
                </StackPanel>
            </controls:PivotItem>

            <!--Pivot item one-->
            <controls:PivotItem Header="Results">
                <!--Double line list with text wrapping-->
                <Grid>
                    <StackPanel Orientation="Horizontal" Margin="0,-26,0,0" Height="24" VerticalAlignment="Top">
                        <TextBlock Text="{Binding TotalFound}"  FontFamily="Segoe WP Light" Style="{StaticResource PhoneTextSmallStyle}" HorizontalAlignment="Left"/>
                        <TextBlock Text="results"  FontFamily="Segoe WP Light" Style="{StaticResource PhoneTextSmallStyle}" HorizontalAlignment="Left" Margin="0"></TextBlock>
                    </StackPanel>
                    <ListBox x:Name="FirstListBox" ItemsSource="{Binding Items}" Margin="0,0,-12,0">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <Grid Width="456" Margin="0,0,0,8" Tag="{Binding Uri}" Tap="Grid_Tap">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" MinHeight="64" />
                                        <RowDefinition Height="Auto" MinHeight="32" />
                                        <RowDefinition Height="Auto" MinHeight="22" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="36"/>
                                        <ColumnDefinition/>
                                        <ColumnDefinition Width="44"/>
                                        <ColumnDefinition Width="44"/>
                                    </Grid.ColumnDefinitions>
                                    <Image Source="{Binding Icon}" VerticalAlignment="Top" HorizontalAlignment="Left" Width="32" Height="32" />
                                    <TextBlock Text="{Binding Title}" TextWrapping="Wrap" Style="{StaticResource PhoneTextTitle3Style}" d:LayoutOverrides="Height" Grid.Column="1" Margin="0,0,4,0"/>
                                    <TextBlock Text="{Binding Summary}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="3" Margin="0" FontSize="22.667"/>

                                    <StackPanel Grid.Column="1" Grid.ColumnSpan="3" Grid.Row="2" Orientation="Horizontal">
                                        <Rectangle Width="16" Height="16" Margin="0,0,4,0">
                                            <Rectangle.OpacityMask>
                                                <ImageBrush ImageSource="/Images/pensil.png"/>
                                            </Rectangle.OpacityMask>
                                            <Rectangle.Fill>
                                                <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                            </Rectangle.Fill>
                                        </Rectangle>
                                        <TextBlock TextWrapping="NoWrap" Style="{StaticResource PhoneTextSmallStyle}" Margin="0" FontFamily="Segoe WP Light" Text="{Binding LastModifiedTime}"  HorizontalAlignment="Left"/>
                                    </StackPanel>
                                    <Grid Grid.Column="2" Margin="0,0,1,0" Width="44" Height="64" VerticalAlignment="Top" Tag="{Binding}" Tap="FlagButtonClick">
                                        <Grid.Background>
                                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                        </Grid.Background>
                                        <Image Source="{Binding FlaggedIcon}" />
                                    </Grid>
                                    <Grid Grid.Column="3" Margin="0" Width="44" Height="64" VerticalAlignment="Top" Tag="{Binding Uri}" Tap="BrowseButtonClick">
                                        <Grid.Background>
                                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                        </Grid.Background>
                                        <Image Source="/Images/IE.png" />
                                    </Grid>
                                </Grid>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>
                </Grid>
            </controls:PivotItem>

            <!--Pivot item two-->
            <controls:PivotItem Header="Flagged">
                <!--Triple line list no text wrapping-->
                <Grid>
                    <StackPanel Orientation="Horizontal" Margin="0,-26,0,0" Height="24" VerticalAlignment="Top">
                        <TextBlock Text="{Binding LeftCount}"  FontFamily="Segoe WP Light" Style="{StaticResource PhoneTextSmallStyle}" HorizontalAlignment="Left"/>
                        <TextBlock Text="slot(s) left"  FontFamily="Segoe WP Light" Style="{StaticResource PhoneTextSmallStyle}" HorizontalAlignment="Left" Margin="0"></TextBlock>
                    </StackPanel>
                    <ListBox x:Name="FlaggedList" ItemsSource="{Binding FlaggedItems}" Margin="0,0,-12,0">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <Grid Width="456" Margin="0,0,0,8" Tag="{Binding Uri}" Tap="Grid_Tap">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="Auto" MinHeight="64" />
                                        <RowDefinition Height="Auto" MinHeight="32" />
                                        <RowDefinition Height="Auto" MinHeight="22" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="36"/>
                                        <ColumnDefinition/>
                                        <ColumnDefinition Width="44"/>
                                        <ColumnDefinition Width="44"/>
                                    </Grid.ColumnDefinitions>
                                    <Image Source="{Binding Icon}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="32" Height="32" />
                                    <TextBlock Text="{Binding Title}" TextWrapping="Wrap" Style="{StaticResource PhoneTextTitle3Style}" d:LayoutOverrides="Height" Grid.Column="1" Margin="0,0,4,0"/>
                                    <TextBlock Text="{Binding Summary}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="3" Margin="0" FontSize="22.667"/>

                                    <StackPanel Grid.Column="1" Grid.ColumnSpan="3" Grid.Row="2" Orientation="Horizontal">
                                        <Rectangle Height="16" Margin="0,0,4,0" Width="16">
                                            <Rectangle.Fill>
                                                <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                            </Rectangle.Fill>
                                            <Rectangle.OpacityMask>
                                                <ImageBrush ImageSource="/Images/pensil.png"/>
                                            </Rectangle.OpacityMask>
                                        </Rectangle>

                                        <TextBlock TextWrapping="NoWrap" Style="{StaticResource PhoneTextSmallStyle}" Margin="0" FontFamily="Segoe WP Light" Text="{Binding LastModifiedTime}"  HorizontalAlignment="Left"/>
                                    </StackPanel>
                                    <Grid Grid.Column="2" Margin="0,0,1,0" Width="44" Height="64" VerticalAlignment="Top" Tag="{Binding}" Tap="UnflagButtonClick">
                                        <Grid.Background>
                                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                        </Grid.Background>
                                        <Image Source="{Binding FlaggedIcon}" />
                                    </Grid>
                                    <Grid Grid.Column="3" Margin="0" Width="44" Height="64" VerticalAlignment="Top" Tag="{Binding Uri}" Tap="BrowseButtonClick">
                                        <Grid.Background>
                                            <SolidColorBrush Color="{StaticResource PhoneAccentColor}"/>
                                        </Grid.Background>
                                        <Image Source="/Images/IE.png" />
                                    </Grid>
                                </Grid>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>
                </Grid>
            </controls:PivotItem>
        </controls:Pivot>
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Mode="Minimized" Opacity="0.5">
            <!--<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>-->
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="about" Click="menuAbout_Click" x:Name="menuAbout" />
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>
